<template>
	<slot v-if="!isExtend" name="default"></slot>
	<slot v-else name="extend"></slot>
	<slot name="footer"></slot>
	<el-button v-if="!isExtend" type="primary" link @click="haldleExtend" :class="class">
		展开 <SvgIcon name="ele-ArrowDown" :size="80" />
	</el-button>
	<el-button v-else type="primary" link @click="haldleExtend" :class="class"> 收起 <SvgIcon name="ele-ArrowUp" :size="80" /> </el-button>
</template>
<script lang="ts" setup>
import { ref } from 'vue';
const props = defineProps({
	class: {
		type: String,
		default: 'mb-[18px]',
	},
});
const isExtend = ref(false);
const haldleExtend = () => {
	isExtend.value = !isExtend.value;
};
</script>
